import VueDatepickerLocal from "vue-datepicker-local";

/**
 * 载入项目引导文件
 */
require('./bootstrap');

window.Vue = require('vue');

//标签输入，官方网址：http://www.vue-tags-input.com/#/
import InputTag from 'vue-input-tag';
import Treeselect from "@riophae/vue-treeselect/dist/vue-treeselect";

const app = new Vue({
    el: '#wrapper',
    data:{
        table:null,
        searchParams:{
            keyword:'',
            card_type:'',
        },
        card_type_list:page_params.data_card_type,//卡券类型列表
        testWhiteData:{openIds:[]},
        stockModData:{card_base_id:0,mod_type:'increase','stock_num':1,},
        box:null,
    },
    mounted:function(){
        let tableOptions = utils.bootstraptableOptions;
        //请求后台的URL
        tableOptions.url = page_params.url_list;
        //搜索参数
        tableOptions.queryParams = (params) => {//传递参数（*）
            //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            var temp = {
                pageSize:params.pageSize,
                page:params.pageNumber,
            };
            return _.merge(temp, this.searchParams);
        };
        tableOptions.columns = [
            {field: 'card_base_id',title: '卡券ID'},
            {field: 'card_type_str',title: '卡券类型',},
            {field: 'card_id',title: '微信卡券ID'},
            {field: 'title',title: '卡券名'},
            {field: 'brand_name',title: '商户名字'},
            {
                field: 'logo_url',title: '卡券的商户logo',
                formatter:function (value, row, index) {
                    if (value){
                        return '<img alt="image" class="img-rounded img-md" src="' + value + '">';
                    }
                }
            },
            {field: 'audit_status_str',title: '状态'},
            {field: 'audit_result',title: '发布结果'},
            {
                field: 'receive_count',title: '已领取数',
                formatter: (value, row, index) => {
                    return row.sku.total_quantity - row.sku.quantity;
                },//自定义方法，添加操作按钮
            },
            {field: 'sku.quantity',title: '剩余库存数'},
            {field: 'sku.total_quantity',title: '总库存数'},
            {
                field: 'operate',
                title: '操作',
                formatter: (value, row, index) => {
                    //已经删除的卡券不再显示操作按钮
                    if (row.audit_status == 40){
                        return '';
                    }
                    let buttons = [];
                    if (row.audit_status != 10 && page_params.url_edit){//编辑卡券
                        buttons.push('<a class="btn btn-primary btn-sm btn-edit" href="'+ page_params.url_edit +'?id='+ row.card_base_id +'"><i class="fa fa-pencil"></i> 编辑</a>');
                    }
                    if (row.audit_status != 10 && page_params.url_publish){//卡券发布
                        buttons.push('<button class="btn btn-primary btn-sm btn-publish"><i class="fa fa-cloud-upload"></i> 发布</button>');
                    }
                    if (row.card_id && page_params.url_modifystock){//修改库存
                        buttons.push('<button class="btn btn-primary btn-sm btn-modifystock"><i class="fa fa-archive"></i> 库存</button>');
                    }
                    if (page_params.url_del){//卡券删除
                        buttons.push('<button class="btn btn-warning btn-sm btn-del"><i class="fa fa-trash"></i> 删除</button>');
                    }
                    return buttons.join("\r\n");
                },//自定义方法，添加操作按钮
                events : {
                    'click .btn-del' : (e, value, row, index) => {
                        utils.confirm(page_params.url_del,{'card_base_id':row.card_base_id}, (response, data) =>{
                            data = response.data;
                            utils.showToastr(data);
                            if (data.status == 'success') {
                                this.query();
                            }
                        });
                    },
                    'click .btn-publish' : (e, value, row, index) => {
                        utils.confirm(page_params.url_publish,{'card_base_id':row.card_base_id,'card_type':row.card_type}, (response, data) =>{
                            data = response.data;
                            utils.showToastr(data);
                            if (data.status == 'success') {
                                this.query();
                            }
                        },'你确定发布该卡券么？','发布后将进入审核阶段，审核阶段不允许修改卡券信息');
                    },
                    'click .btn-modifystock' : (e, value, row, index) => {
                        this.stockModData.card_base_id = row.card_base_id;
                        this.box = layer.open({
                            type: 1,
                            title: '设置卡券库存',
                            anim: 2,
                            shadeClose: true, //开启遮罩关闭
                            skin: 'layui-layer-molv', //加上边框
                            area: ['500px', '250px'], //宽高
                            content: $('#box-modifystock')
                        });
                    },
                }
            },
        ];
        this.table = $("#table").bootstrapTable(tableOptions);
    },
    methods: {
        query: function () {
            this.table.bootstrapTable('refresh');
        },
        sync:function (){
            utils.confirm(page_params.url_sync,{}, (response, data) =>{
                utils.showToastr(response.data);
                this.query();
            },'你确定拉取微信端卡券么？','该操作将会覆盖到本地数据库中已存在的卡券数据,同步过程比较耗时，将会异步后台执行');
        },
        openTestWhite:function () {//打开白名单
            utils.ajaxGet(page_params.url_upsettestwhite, {}, (response, params) => {
                this.testWhiteData = response.data.data;
            });
            this.box = layer.open({
                type: 1,
                title: '设置测试白名单',
                anim: 2,
                shadeClose: true, //开启遮罩关闭
                skin: 'layui-layer-molv', //加上边框
                area: ['500px', '400px'], //宽高
                content: $('#box-testwhite')
            });
        },
        saveTestWhite:function () {//保存白名单
            utils.ajaxPost(page_params.url_upsettestwhite, this.testWhiteData, (response, params) => {
                if (response.data.status == 'success'){
                    layer.close(this.box);
                }
                utils.showToastr(response.data);
            });
        },
        saveModStock:function () {//保存库存设置
            utils.ajaxPost(page_params.url_modifystock, this.stockModData, (response, params) => {
                if (response.data.status == 'success'){
                    layer.close(this.box);
                    this.query();
                }
                utils.showToastr(response.data);
            });
        }
    },
    components: {
        InputTag
    },
});